<!DOCTYPE html>
<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8" %>
<%@ include file="../core/core.jsp"%>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0"><meta name="renderer" content="webkit">

    <title>商品分类</title>
    <meta name="keywords" content="叮当猫">
    <meta name="description" content="叮当猫">
    <link href="../static/css/summernote.css" rel="stylesheet">
    <link href="../static/css/summernote-bs3.css" rel="stylesheet">
    <link href="../static/css/cropper.min.css" rel="stylesheet">
    <link href="../static/css/sitelogo.css" rel="stylesheet">
    <script src="../static/js/photoClip/cropper2.js"></script>
    <script src="../static/js/photoClip/sitelogo.js"></script>
    <link rel="stylesheet" href="../static/zyupload/skins/zyupload-1.0.0.min.css " type="text/css">
    <script type="text/javascript" src="../static/zyupload/zyupload.drag-1.0.0.min.js"></script>
    <style>
        #clipArea {
            margin: 20px;
            height: 300px;
        }
        #file,
        #clipBtn {
            margin: 20px;
        }
        #view {
            margin: 0 auto;
            width: 200px;
            height: 200px;
        }
        table.dataTable thead .sorting:after{
            content:'';
        }
        .note-editor{
            background: #f5f5f5;
        }
        .avatar-wrapper {
            width: 522px;
            height: 175px;
        }
        table.dataTable thead .sorting:after{
            content:'';
        }
        .oneImgBox,.oneImgBox2{
            position: relative;
            width: auto;
            height: 120px;
            margin-right: 10px;
            float: left;
        }
        .oneImgBox img,.oneImgBox2 img{
            width: auto;
            height: 120px;
            display: block;
        }
        .oneImgBox span,.oneImgBox2 span{
            width: 18px;
            height: 18px;
            font-size: 18px;
            line-height: 18px;
            position: absolute;
            top:0;
            right: 0;
            cursor: pointer;
        }
    </style>
</head>

<body>

<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>基本 <small>查找，结果</small></h5>
                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="fa fa-chevron-up"></i>
                        </a>
                        <a class="dropdown-toggle" data-toggle="dropdown" href="">
                            <i class="fa fa-wrench"></i>
                        </a>
                        <a class="close-link">
                            <i class="fa fa-times"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">

                    <div id="DataTables_Table_0_wrapper" class="dataTables_wrapper form-inline" role="grid"><div class="row" style="margin-bottom: 20px;">
                        <div class="col-sm-12">
                            <div id="DataTables_Table_0_filter" class="dataTables_filter">
                                <div class="form-group"><label>状态</label>
                                    <select name="state" id="state" style="width:200px;height: 34px;">
                                        <option value="">全部</option>
                                        <option value="1">有效</option>
                                        <option value="0">无效</option>
                                    </select>
                                </div>
                                <div class="form-group m-l"><label>分类名称：</label>
                                    <input type="text" class="form-control input-sm" id="name">
                                </div>
                                <div class="form-group m-l"><label>分类级别：</label>
                                    <select name="type" id="type" style="width:200px;height: 34px;">
                                        <option value="">请选择</option>
                                        <option value="1">一级分类</option>
                                        <option value="2">二级分类</option>
                                        <option value="3">三级分类</option>
                                    </select>
                                </div>
                                <%--<div class="form-group m-l"><label>分类类型：</label>--%>
                                    <%--<select name="type" id="categoryType" style="width:200px;height: 34px;">--%>
                                        <%--<option value="">请选择</option>--%>
                                        <%--<option value="1">普通分类</option>--%>
                                        <%--<option value="2">热门品牌</option>--%>
                                    <%--</select>--%>
                                <%--</div>--%>
                                <div class="form-group m-l"><label>父级分类</label>
                                    <select name="faMenu" id="twoLEvel" style="width:200px;height: 34px;">
                                        <option value="">请选择父级分类</option>
                                    </select>
                                </div>
                                <div class="form-group m-t" id="erjiLEvelBox"><label>二级分类</label>
                                    <select name="faMenu" id="erjiLEvel" style="width:200px;height: 34px;">
                                        <option value="">请选择父级分类</option>
                                    </select>
                                </div>
                                <button class="btn btn-primary m-t m-l" id="refer">查询</button>
                                <button class="btn btn-primary m-t m-l" id="add" data-toggle="modal" data-target="#myModal5">添加</button>
                            </div>
                        </div>
                    </div>
                        <div class="modal inmodal fade" id="myModal5" tabindex="-1" role="dialog"  aria-hidden="true">
                            <div class="modal-dialog modal-lg">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                        <h4 class="modal-title">添加分类</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="form-group"><label>分类名称</label> <input type="text" id="addName" class="form-control"></div>
                                        <div class="form-group"><label>分类简介</label> <input type="text" id="summary" class="form-control"></div>
                                        <div class="form-group"><label>分类级别</label>
                                            <select name="addType" id="addType" style="width:200px;height: 34px;">
                                                <option value="">请选择</option>
                                                <option value="1">一级分类</option>
                                                <option value="2">二级分类</option>
                                                <option value="3">三级分类</option>
                                            </select>
                                        </div>
                                        <%--<div class="form-group" id="addcategoryTypeBox"><label>分类类型</label>--%>
                                            <%--<select name="addfaMenu" id="addcategoryType" style="width:200px;height: 34px;">--%>
                                                <%--<option value="">请选择</option>--%>
                                                <%--<option value="1">普通类型</option>--%>
                                                <%--<option value="2">热门品牌</option>--%>
                                            <%--</select>--%>
                                        <%--</div>--%>
                                        <div class="form-group" id="addfaBox"><label>一级分类id</label>
                                            <select name="addfaMenu" id="addfaMenu" style="width:200px;height: 34px;">
                                                <option value="">请选择</option>
                                            </select>
                                        </div>
                                        <div class="form-group" id="addfaBox2" style="display: none;"><label>二级分类id</label>
                                            <select name="addfaMenu" id="addfaMenu2" style="width:200px;height: 34px;">
                                                <option value="">请选择</option>
                                            </select>
                                        </div>
                                        <div class="form-group" id="cateGoryImgBox"><label>分类图片</label>
                                            <div class="user_pic" style="margin: 0px;" id="imgBox">
                                                <img id="mainImg" src="../static/img/uploadImg.png" alt="img" style="width: auto;height: 120px;">
                                            </div>
                                            <button id="update" type="button" class="btn btn-primary"  data-toggle="modal" data-target="#avatar-modal" style="margin-bottom: 0px;">
                                                上传分类图片
                                            </button>
                                            <div class="user_pic" style="margin: 10px;">
                                                <img src=""/>
                                            </div>
                                        </div>
                                        <div class="form-group" id="linkUrlBox">
                                            <label>跳转路径</label> <input type="text" id="linkUrl" class="form-control">
                                        </div>
                                        <div class="form-group"><label>优先级</label> <input type="text" id="number" class="form-control" onchange="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')"></div>
                                    </div>

                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-white" data-dismiss="modal" id="close">关闭</button>
                                        <button type="button" class="btn btn-primary" id="addSave">保存</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="modal inmodal fade" id="modal4" tabindex="-1" role="dialog"  aria-hidden="true">
                            <div class="modal-dialog modal-lg">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                        <h4 class="modal-title">编辑分类</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="form-group"><label>分类名称</label> <input type="text" id="editName" class="form-control"></div>
                                        <div class="form-group"><label>分类简介</label> <input type="text" id="editsummary" class="form-control"></div>
                                        <%--<div class="form-group" id="editcategoryTypeBox"><label>分类类型</label>--%>
                                            <%--<select name="addfaMenu" id="editcategoryType" style="width:200px;height: 34px;">--%>
                                                <%--<option value="">请选择</option>--%>
                                                <%--<option value="1">普通类型</option>--%>
                                                <%--<option value="2">热门品牌</option>--%>
                                            <%--</select>--%>
                                        <%--</div>--%>
                                        <div class="form-group"><label>分类图片</label>
                                            <div class="user_pic" style="margin: 0px;" id="imgBox2">
                                                <img id="mainImg2" src="../static/img/uploadImg.png" alt="img" style="width: auto;height: 120px;">
                                            </div>
                                            <button id="update2" type="button" class="btn btn-primary"  data-toggle="modal" data-target="#avatar-modal" style="margin-bottom: 0px;">
                                                上传分类图片
                                            </button>
                                            <div class="user_pic" style="margin: 10px;">
                                                <img src=""/>
                                            </div>
                                        </div>
                                        <div class="form-group" id="editlinkUrlBox">
                                            <label>跳转路径</label> <input type="text" id="editlinkUrl" class="form-control">
                                        </div>
                                        <div class="form-group">
                                            <label>优先级</label> <input type="text" id="editNumber" class="form-control" onchange="this.value=this.value.replace(/\D/g,'')" onkeyup="this.value=this.value.replace(/\D/g,'')">
                                        </div>
                                        <div class="form-group"><label>状态</label>
                                            <select name="state" id="editState" style="width:200px;height: 34px;">
                                                <option value="">全部</option>
                                                <option value="true">有效</option>
                                                <option value="false">无效</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                                        <button type="button" class="btn btn-primary" id="editSave">保存</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <table class="table table-striped table-bordered table-hover dataTables-example dataTable" id="DataTables_Table_0" aria-describedby="DataTables_Table_0_info">
                            <thead>
                            <tr role="row">
                                <th class="sorting_asc" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 60px;" aria-sort="ascending">#</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">分类名称</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">分类简介</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">分类级别</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">父分类</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">是否有效</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">优先级</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">创建人</th>
                                <th class="sorting" tabindex="0" aria-controls="DataTables_Table_0" rowspan="1" colspan="1" style="width: 300px;">创建时间</th>
                            </tr>
                            </thead>
                            <tbody id="withdraw-record">
                            <!--<tr class="gradeA odd">-->
                            <!--<td class="sorting_1">14</td>-->
                            <!--<td class=" ">100</td>-->
                            <!--<td class=" ">2</td>-->
                            <!--<td class="center ">ky</td>-->
                            <!--<td class="center ">待审核</td>-->
                            <!--<td class="sorting_1">15093112512</td>-->
                            <!--<td class=" ">1</td>-->
                            <!--<td class=" ">2017-02-01 09:09</td>-->
                            <!--<td class="center ">z-097967897878978</td>-->
                            <!--<td class="center ">2017-02-02 10:10</td>-->
                            <!--</tr>-->
                            </tbody>
                        </table><div class="row"><div class="col-sm-6"><div class="dataTables_info" id="DataTables_Table_0_info" role="alert" aria-live="polite" aria-relevant="all">共 <span id="record"></span> 项</div></div><div class="col-sm-6"><div class="dataTables_paginate paging_simple_numbers" id="DataTables_Table_0_paginate"><ul class="pagination"><li class="paginate_button previous disabled" aria-controls="DataTables_Table_0" tabindex="0" id="DataTables_Table_0_previous"><a href="#">上一页</a></li><li class="paginate_button active" aria-controls="DataTables_Table_0" tabindex="0"><a href="#">1</a></li><li class="paginate_button " aria-controls="DataTables_Table_0" tabindex="0"><a href="#">2</a></li><li class="paginate_button " aria-controls="DataTables_Table_0" tabindex="0"><a href="#">3</a></li><li class="paginate_button " aria-controls="DataTables_Table_0" tabindex="0"><a href="#">4</a></li><li class="paginate_button " aria-controls="DataTables_Table_0" tabindex="0"><a href="#">5</a></li><li class="paginate_button " aria-controls="DataTables_Table_0" tabindex="0"><a href="#">6</a></li><li class="paginate_button next" aria-controls="DataTables_Table_0" tabindex="0" id="DataTables_Table_0_next"><a href="#">下一页</a></li></ul></div></div></div></div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="avatar-modal" aria-hidden="true" aria-labelledby="avatar-modal-label" role="dialog" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content" style="width: 690px;height: 705px">
            <!--<form class="avatar-form" action="upload-logo.php" enctype="multipart/form-data" method="post">-->
            <%--<form class="avatar-form">--%>
                <div class="modal-header">
                    <button class="close" data-dismiss="modal" type="button">&times;</button>
                    <h4 class="modal-title" id="avatar-modal-label">上传图片</h4>
                </div>
                <div class="modal-body">
                    <div class="avatar-body">
                        <div class="col-md-12">图片上传</div>
                        <div id="zyupload" class="zyupload"></div>

                        <script type="text/javascript">
                            var mainImageUrlAll ='';
                            $(function(){
                                // 初始化插件
                                $("#zyupload").zyUpload({
                                    width            :   "650px",                 // 宽度
                                    height           :   "400px",                 // 宽度
                                    itemWidth        :   "140px",                 // 文件项的宽度
                                    itemHeight       :   "115px",                 // 文件项的高度
                                    url              :   "/crm/uploadImage.do",  // 上传文件的路径
                                    fileType         :   ["jpg","png","js","exe"],// 上传文件的类型
                                    fileSize         :   51200000,                // 上传文件的大小
                                    multiple         :   true,                    // 是否可以多个文件上传
                                    dragDrop         :   true,                    // 是否可以拖动上传文件
                                    tailor           :   false,                    // 是否可以裁剪图片
                                    del              :   true,                    // 是否可以删除文件
                                    finishDel        :   false,  				  // 是否在上传文件完成后删除预览
                                    /* 外部获得的回调接口 */
                                    onSelect: function(selectFiles, allFiles){    // 选择文件的回调方法  selectFile:当前选中的文件  allFiles:还没上传的全部文件
                                        console.info("当前选择了以下文件：");
                                        console.info(selectFiles);
                                    },
                                    onDelete: function(file, files){              // 删除一个文件的回调方法 file:当前删除的文件  files:删除之后的文件
                                        console.info("当前删除了此文件：");
                                        console.info(file.name);
                                    },
                                    onSuccess: function(file, response){// 文件上传成功的回调方法

                                        var args = response.split("|");
                                        mainImageUrlAll+=args[1]+",";
                                        //铺出来上传成功后的图片
                                        if(ifEdit==0){
                                            $('#imgBox').empty();
                                            $('#imgBox').append(
                                                '<div class="oneImgBox"><img id="mainImg" src="'+args[1]+'" alt="img" ifShow="true" style="width: 66px;height: 66px;"><span class="del">×</span></div>'
                                            );
                                        }else{
                                            $('#imgBox2').empty();
                                            $('#imgBox2').append('<div class="oneImgBox2"><img id="mainImg2" src="'+args[1]+'" alt="img" style="width: 66px;height: 66px;"><span class="del">×</span></div>')
                                        }
                                        $("#uploadInf").append("<p>上传成功，文件地址是：" + response + "</p>");
                                    },
                                    onFailure: function(file, response){          // 文件上传失败的回调方法
                                        console.info("此文件上传失败：");
                                        console.info(file.name);
                                    },
                                    onComplete: function(response){           	  // 上传完成的回调方法

                                        $("#uploadInf").append("<p>上传成功" + response + "</p>");
                                    }
                                });

                            });

                        </script>
                        <%--<div class="avatar-upload">--%>
                            <%--<input class="avatar-src" name="avatar_src" type="hidden">--%>
                            <%--<input class="avatar-data" name="avatar_data" type="hidden">--%>
                            <%--<label for="avatarInput" style="line-height: 35px;">图片上传</label>--%>
                            <%--<button class="btn btn-primary"  type="button" style="height: 35px;" onclick="$('input[id=avatarInput]').click();">请选择图片</button>--%>
                            <%--<span id="avatar-name"></span>--%>
                            <%--<input class="avatar-input hide" id="avatarInput" name="avatar_file" type="file"></div>--%>
                        <%--<div class="row">--%>
                            <%--<div class="col-md-9">--%>
                                <%--<div class="avatar-wrapper"></div>--%>
                            <%--</div>--%>
                            <%--<div class="col-md-12">--%>
                                <%--<div class="avatar-preview preview-lg" id="imageHead" style="width: 522px;height: 175px;"></div>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                        <%--<div class="row avatar-btns">--%>
                            <%--<div class="col-md-5" style="text-align: right;">--%>
                                <%--<button class="btn btn-primary fa fa-arrows" data-method="setDragMode" data-option="move" type="button" title="移动">--%>
							            <%--<span class="docs-tooltip" data-toggle="tooltip" title="" data-original-title="$().cropper(&quot;setDragMode&quot;, &quot;move&quot;)">--%>
							            <%--</span>--%>
                                <%--</button>--%>
                                <%--<button type="button" class="btn btn-primary fa fa-search-plus" data-method="zoom" data-option="0.1" title="放大图片">--%>
							            <%--<span class="docs-tooltip" data-toggle="tooltip" title="" data-original-title="$().cropper(&quot;zoom&quot;, 0.1)">--%>
							              <%--<!--<span class="fa fa-search-plus"></span>-->--%>
							            <%--</span>--%>
                                <%--</button>--%>
                                <%--<button type="button" class="btn btn-primary fa fa-search-minus" data-method="zoom" data-option="-0.1" title="缩小图片">--%>
							            <%--<span class="docs-tooltip" data-toggle="tooltip" title="" data-original-title="$().cropper(&quot;zoom&quot;, -0.1)">--%>
							              <%--<!--<span class="fa fa-search-minus"></span>-->--%>
							            <%--</span>--%>
                                <%--</button>--%>
                                <%--<button type="button" class="btn btn-primary fa fa-refresh" data-method="reset" title="重置图片">--%>
								            <%--<span class="docs-tooltip" data-toggle="tooltip" title="" data-original-title="$().cropper(&quot;reset&quot;)" aria-describedby="tooltip866214">--%>
                                            <%--</span>--%>
                                <%--</button>--%>
                            <%--</div>--%>
                            <%--<div class="col-md-12 m-t m-b">--%>
                                <%--<div class="btn-group btn-group-justified" data-toggle="buttons">--%>
                                    <%--<label class="btn btn-primary" data-method="setAspectRatio" data-option="1.55" title="Set Aspect Ratio">--%>
                                        <%--<input class="sr-only" id="aspestRatio1" name="aspestRatio" value="1.55" type="radio">--%>
                                        <%--<span class="docs-tooltip" data-toggle="tooltip" title="$().cropper(&quot;setAspectRatio&quot;, 31 / 20)">31:20</span>--%>
                                    <%--</label>--%>
                                    <%--<label class="btn btn-primary" data-method="setAspectRatio" data-option="2.98285714" title="Set Aspect Ratio">--%>
                                        <%--<input class="sr-only" id="aspestRatio2" name="aspestRatio" value="2.98285714" type="radio">--%>
                                        <%--<span class="docs-tooltip" data-toggle="tooltip" title="$().cropper(&quot;setAspectRatio&quot;, 13 / 4)">13：4</span>--%>
                                    <%--</label>--%>

                                    <%--<label class="btn btn-primary" data-method="setAspectRatio" data-option="1" title="Set Aspect Ratio">--%>
                                        <%--<input class="sr-only" id="aspestRatio3" name="aspestRatio" value="1" type="radio">--%>
                                        <%--<span class="docs-tooltip" data-toggle="tooltip" title="$().cropper(&quot;setAspectRatio&quot;, 1 / 1)">1:1</span>--%>
                                    <%--</label>--%>
                                <%--</div>--%>
                            <%--</div>--%>
                            <%--<div class="col-md-12 m-t m-b"><span>注：一级分类原始尺寸应为522*175选择13：4，三级分类热门品牌原始尺寸应为186*120选择31：20，普通类型原始尺寸应为144*144选择1：1</span></div>--%>
                            <%--<div class="col-md-3">--%>
                                <%--<button class="btn btn-primary btn-block avatar-save fa fa-save" type="button" id="save"> 保存修改</button>--%>
                            <%--</div>--%>
                        <%--</div>--%>
                    </div>
                </div>
            <%--</form>--%>
        </div>
    </div>
</div>
<script src="../static/js/ajaxfileupload_v1.js"></script>
<script src="../static/js/photoClip/html2canvas.min.js" type="text/javascript" charset="utf-8"></script>

<script src="../static/js/goodsCategory/list.js" charset="utf-8"></script>
<script>

</script>
</body>

</html>
